<template>
	<c-pop-box :d="{ close: false, gap: false }">
		<view class="c-count-rebirth">
			<view class="font-size47 color-white text-center margin-bottom85">复活</view>
			<view class="dis-flex margin-bottom75">
				<view><circle-count-down :fontColor="'#ffffff'" :total="downTime" @callback="downCallback"></circle-count-down></view>
			</view>
			<block v-if="!isStepTwo">
				<block v-if="resurrectedNum <= 1">
					<view class="font-size30 color-white text-center margin-bottom44">观看15秒视频可以复活继续答题哦~</view>
					<form @submit="setFormId" report-submit class="dis-flex margin-bottom44">
						<button form-type="submit" @tap="btnFree()" class="dis-flex height84 border-radius mc-bold" style="width:450upx;background-color:#FE5E00">
							<text class="font-size30 color-white line-height">免费复活</text>
						</button>
					</form>
				</block>
				<block v-else>
					<view class="font-size30 color-white text-center margin-bottom44">点击下面广告即可原地复活继续答题噢~</view>
					<view style="margin-top:60upx;margin-bottom:30upx"><banner-ad></banner-ad></view>
				</block>
				<block v-if="isShowShare">
					<view class="font-size30 color-white text-center margin-bottom44">答题太难了？你可以</view>
					<form @submit="setFormId" report-submit class="dis-flex margin-bottom44">
						<button form-type="submit" @tap="toShareReceive" class="dis-flex height84 border-radius mc-bold" style="width:450upx;background-color:#03b164">
							<text class="font-size30 color-white line-height">邀请好友可获得兑换券×1</text>
						</button>
					</form>
				</block>
			</block>
			<form @submit="setFormId" report-submit class="dis-flex margin-bottom44" v-else>
				<block v-if="isIOS">
					<view class="font-size30 color-white text-center margin-bottom44">观看15秒视频可以复活继续答题哦~</view>
					<form @submit="setFormId" report-submit class="dis-flex margin-bottom44">
						<button form-type="submit" @tap="btnFree()" class="dis-flex height84 border-radius mc-bold" style="width:450upx;background-color:#FE5E00">
							<text class="font-size30 color-white line-height">免费复活</text>
						</button>
					</form>
				</block>
				<block v-else>
					<view class="font-size30 color-white text-center margin-bottom44">支付1元即可原地复活继续答题，免费换皮肤</view>
					<button form-type="submit" @tap="btnPay()" class="dis-flex height84 border-radius mc-bold" style="width:450upx;background-color:#FE5E00">
						<text class="font-size30 color-white line-height">1元复活</text>
					</button>
				</block>
			</form>
			<button
				@tap="btnAbandon()"
				plain
				class="font-size30 color-white text-center mc-bold"
				style="width: 200rpx;height: 60rpx;line-height: 60rpx;"
				:style="'border:' + (isStepTwo ? '0' : '1') + 'px solid #FFFFFF;'"
			>
				放弃复活
			</button>
		</view>
	</c-pop-box>
</template>
<script>
import { mapGetters, mapActions } from 'vuex';
import { requestPayment } from '@/utils/pay';
import CPopBox from '@/components/global/c-pop/c-pop-box';
import CircleCountDown from '@/components/circle-count-down';
let videoAd = qq.createRewardedVideoAd({
	adUnitId: '842d6982c2f159f9f1eb85cc40d3318d'
});
export default {
	name: 'c-count-rebirth',
	props: {
		value: {
			type: Object,
			default: {}
		}
	},
	components: {
		CPopBox,
		CircleCountDown
	},
	data() {
		return {
			isIOS: false,
			downTime: 7, // 12,
			playState: true,
			videoAd: videoAd,
			isCallback: true,
			list: []
		};
	},
	watch: {},
	computed: {
		isStepTwo: function() {
			//true 用户已成功领过一张以上的兑换劵 ，false是未领过
			return this.value.isStepTwo || false;
		},
		isShowShare: function() {
			//是否显示分享领劵按钮
			return this.value.isShowShare || false;
		},
		resurrectedNum: function() {
			//复活过的次数
			return this.value.resurrectedNum || 0;
		}
	},
	methods: {
		...mapActions('pop', ['popShow']),
		...mapActions('user', ['gameInfoUp']),
		// btn 免费复活
		btnFree() {
			this.popShow();
			this.$store.dispatch('videoAd/show', {
				success: () => {
					this.popClose();
				},
				fail: () => {
					this.popShow({
						key: 'CCountRebirth',
						value: this.value
					});
				}
			});
		},
		// 分享好友领劵
		toShareReceive() {
			this.popShow();
			uni.redirectTo({
				url: '/pages/home/share/share'
			});
		},
		// btn 1元复活
		async btnPay() {
			const that = this;
			let res, resQQpay;
			try {
				res = await this.addOrder();
				resQQpay = await this.qqapplet({
					orderNo: res.orderNo
				});
			} catch (e) {
				this.$tip.showToast('支付失败', 'none');
				console.log('payError', e);
			}
			this.popShow();
			requestPayment({
				prepayNo: resQQpay.prepayNo,
				success() {
					that.popClose();
				},
				fail() {
					that.popShow({
						key: 'CCountRebirth',
						value: that.value
					});
				}
			});
		},
		async payTemplate() {
			let res = await this.$api.pay.payTemplate();
			this.list = res;
		},
		// 订单号
		async addOrder(obj = {}) {
			let res = await this.$api.pay.addOrderAnswer();
			return res;
		},
		// qq 预支付
		async qqapplet(obj = {}) {
			let res = await this.$api.pay.qqapplet({
				orderNo: obj.orderNo // 商品模板Id
			});
			return res;
		},
		popClose() {
			// this.$emit('callback');
			this.$bus.emit('popClose');
			console.log('复活');
		},
		// btn 放弃复活
		btnAbandon() {
			this.popShow();
			uni.reLaunch({
				url: '/pages/tabBar/home/index'
			});
		},
		// 倒计时回调
		downCallback() {
			this.popShow();
			uni.reLaunch({
				url: '/pages/tabBar/home/index'
			});
		},
		init() {
			this.isCallback = true;
		},
		setFormId(e) {
			this.$store.dispatch('common/formIdListUp', {
				e: e,
				isSave: true
			});
		}
	},
	created() {},
	mounted() {
		this.init();
		this.isIOS = this.$tip.isIOS();
	}
};
</script>
<style lang="scss" scoped>
.c-count-rebirth {
	width: 600upx;
	min-height: 794upx;
}
</style>
